<template>
  <div id="app">
    <div v-if="!showAbout && !showFeed && !yinvc">
      <navig
        v-on:childByValue="childByValue"
        v-on:childByFeed="childByFeed"
      ></navig>
    </div>

    <div v-if="showAbout">
      <about-us v-on:childByValue="childByValue"></about-us>
    </div>

    <div v-if="showFeed">
      <feedback v-on:childByFeed="childByFeed"></feedback>
    </div>

    <router-view v-if="!showAbout && !showFeed"></router-view>
  </div>
</template>

<script>
import Navig from "./components/navigation/Navig.vue";
import AboutUs from "./components/aboutus/AboutUs.vue";
import Feedback from "./components/feedback/Feedback.vue";

export default {
  name: "app",
  components: { Navig, AboutUs, Feedback },
  data() {
    return {
      showAbout: "",
      showFeed: "",
      showLogin: "",
      yinvc: "",
    };
  },
  created() {
    if (
      this.$route.path == "/loginpage" ||
      this.$route.path == "/registerpage" ||
      this.$route.path == "/admin/administration" ||
      this.$route.path == "/admin/administrationmessage" ||
      this.$route.path == "/admin/adminfood" ||
      this.$route.path == "/admin/insertfoods" ||
      this.$route.path == "/admin/admincollocation" ||
      this.$route.path == "/admin/insertadmincoll" ||
      this.$route.path == "/forget" ||
      this.$route.path == "/admin/updatefoods"
    ) {
      this.yinvc = true;
    }
  },
  methods: {
    childByValue: function (childValue) {
      this.showAbout = childValue;
      console.log(this.showAbout);
    },
    childByFeed: function (feedValue) {
      this.showFeed = feedValue;
      console.log(this.showFeed);
    },
  },
};
</script>

<style>
@import url("./assets/css/bees.css");
</style>
